<template>
  <div class="home">

    <div class="content-box" style="padding-bottom: 1.3rem">
      <div class="padding-lr-32">

        <ul class="normal-list" v-if="id === 'safeDelay'"> <!--安全 延期 办理-->
          <li v-for="(item,index) in list" :key="index" @click="select(index)" :class="{active:selected === index}">
          <!--<li v-for="(item,index) in 6" :key="index" @click="select(index)" :class="{active:selected === index}">-->
            <h3 class="title3  margin-bottom-10">{{item.safetyTypeName}}</h3>
            <div class="flex justify-between">
              <div class="normal-list-item" style="width: 60%">
                <p class="normal-list-item-label margin-bottom-10">证书编号</p>
                <p class="normal-list-item-val ">{{item.safetyNo}}</p>
              </div>
              <div class="normal-list-item" style="width: 40%">
                <p class="normal-list-item-label margin-bottom-10">有效期</p>
                <p class="normal-list-item-val">{{item.safetyEdate}}</p>
              </div>
            </div>
          </li>
        </ul>

        <div class="no-data" v-if="list.length===0">
          <p>暂无此类证书</p>
        </div>

      </div>
    </div>

    <div class="footer-button">
      <div class="buttonSubmit" :class="{disabled:selected===null}" @click="routerTo">
        <span>下一步</span>
      </div>
    </div>
  </div>



</template>

<script>
import { Indicator } from 'mint-ui';
export default {
  name: 'Home',
  data() {
    return {
      id:'',
      selected:null,
      papersnumber:'',
      list: new Array()
    }
  },
  beforeRouteEnter(to, from, next) {
    let pages = ['upFile'];
    if(pages.includes(from.name)){
      to.meta.isBack=true;
    }
    next();
  },

  activated() {
    if(!this.$route.meta.isBack){
      this.loadData()
    }
    this.$route.meta.isBack=false

  },
  mounted() {
    this.loadData()
  },
  methods: {

    loadData(){
      let { papersnumber , id  , type } = this.$route.query;
      this.id = id || '';
      this.papersnumber  = papersnumber;
      //console.log(papersnumber);
      Indicator.open('加载中...');
      if(this.id === 'safeDelay'){
        this.GetListSafety();
      }

    },

    select(data){
      if(this.selected === data){
        this.selected = null
      }else {
        this.selected = data
      }

    },

    routerTo(){
      this.$router.push({
        path:'/upFile',
        query:{
          safetyNo:this.list[this.selected].safetyNo, papersnumber:this.papersnumber
        }

      })
    },

    GetListSafety:function (data) {  //安全生产
      let date = new Date().getTime().toString();
      let sign = this.$md5('rySafety' + date);
      let param = {
        from: '3',
        key: 'a98dc7f655df4966a5f0dfa6057c8475',
        sign: sign,
        requestTime: date,
        // ryCard:'362222196912013526'
        ryCard:this.papersnumber
      };
      this.$api.post('/jimp/link.do', {
        param : JSON.stringify(param)
      }, response => {
        console.log(response);
        if(response.status=='200' && (response.data.result || response.data.code ==="200")){
          this.list = response.data.data;
        }else {
          this.list = [];
        }
        Indicator.close();
      });
    },



  }
}
</script>
<style lang="less" scoped>
  .normal-list{
    li{
      border: 1px solid transparent;
      &.active{
        border: 1px solid #2b92fc;
        background: url("../../assets/images/right.png") no-repeat top 0.1rem right 0.1rem;
        background-size: 0.4rem;
      }
    }
  }
</style>
